/*  slideshow.css, version <%= SLIDESHOW_VERSION %>
 *  (c) Copyright 2007 Nathan Herald
 *
 *  slideshow.js is freely distributable under the terms of the GPL 2.0
 *  For details, see the slideshow.js web site: http://code.google.com/p/slideshow-js/
 *
 *------------------------------------------------------------------------------------*/

/* This seems kludgy */
.slideshow.horizontal ul {
	width: 60000px; /* You can adjust this to make it more exact if you can predict the amount of images and their total width (including the padding [margin-right]) */
}

.slideshow.horizontal {
	width: 400px; /* Change me */
	height: 320px; /* Change me */
}

.slideshow.vertical {
	width: 420px; /* Change me */
	height: 300px; /* Change me */
}

.slideshow {
	overflow: auto;
	position: relative;
}

.slideshow ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
}

.slideshow.horizontal ul li {
	float: left;
	margin-right: 10px; /* This is the padding setting for the js */
}

.slideshow.vertical ul li {
	width: 100%;
	margin-bottom: 10px; /* This is the padding setting for the js */
	padding-top: 1px;
	margin-top: -1px;
	/* This doesn't make sense to me at all, but it does work. Without it, it pushes the top of the li down to the top of the image, which is not good when the image has a margin-top. */
}

.slideshow ul li img {
	display: block;
}